<!--
//*********************************************************
//
// Copyright (c) Microsoft. All rights reserved.
// THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF
// ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY
// IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR
// PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.
//
//*********************************************************
-->

<common:LayoutAwarePage
    x:Class="Tiles.ContentDeduplication"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Tiles"
    xmlns:common="using:SDKTemplate.Common"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

     <Grid x:Name="LayoutRoot" Background="White" HorizontalAlignment="Left" VerticalAlignment="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Grid x:Name="Input" Grid.Row="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>

            <StackPanel>
                <TextBlock Style="{StaticResource BasicTextStyle}" TextWrapping="Wrap" FontWeight="SemiBold">
                    This scenario demonstrates tile content deduplication, which is used to ignore redundant notification content on a per-binding (tile size) basis, preventing needless tile refresh animations.
                </TextBlock>

                <TextBlock Style="{StaticResource BasicTextStyle}" Margin="0,20,0,0"  TextWrapping="Wrap" FontWeight="Bold">
                    Content Deduplication
                </TextBlock>

                <TextBlock Style="{StaticResource BasicTextStyle}" TextWrapping="Wrap" >
                    Content deduplication is accomplished by assigning an ID to a specific tile size binding in a notification's XML payload.
                    This ID is the contentId attribute of the binding element. If a notification is received that contains a binding with a contentId
                    that matches the contentId of a currently displayed or queued notification, that particular binding is ignored. The remaining
                    bindings are processed normally.
                    <LineBreak/>

                    <LineBreak/>The primary scenario for content deduplication is support of Square310x310 templates that can display the equivalent of three
                    Wide310x150 tiles, as demonstrated below. In the example, four notifications will be sent to a tile which has its queue enabled,
                    allowing notifications to cycle on the tile. The first notification contains a main story (A) and the next three notifications
                    contain three associated stories (B, C, and D). The last three notifications are consolidated into a Square310x310 tile. The content
                    of each notification and each binding contained within it is as follows:
                    <LineBreak/>

                    <LineBreak/>Notification 1
                    <LineBreak/>Square: A
                    <LineBreak/>Wide:   A
                    <LineBreak/>Large:  A
                    <LineBreak/>

                    <LineBreak/>Notification 2
                    <LineBreak/>Square: B
                    <LineBreak/>Wide:   B
                    <LineBreak/>Large:  B C D
                    <LineBreak/>

                    <LineBreak/>Notification 3
                    <LineBreak/>Square: C
                    <LineBreak/>Wide:   C
                    <LineBreak/>Large:  B C D
                    <LineBreak/>

                    <LineBreak/>Notification 4
                    <LineBreak/>Square: D
                    <LineBreak/>Wide:   D
                    <LineBreak/>Large:  B C D
                    <LineBreak/>

                    <LineBreak/>Because the content of the large binding is identical in the last three notifications, that binding is assigned a contentId
                    in notifications 2, 3, and 4. This causes the large binding in notifications 3 and 4 to be ignored. If the user has set the tile
                    to its small or wide size, content A, B, C, and D cycles separately. If the user has set the tile to its large size, content A only
                    cycles with the consolidated B, C, and D content. If you did not set a contentId, the large tile would animate with each new refresh,
                    even though its content would remain unchanged. Note that the large binding in notification 1 would have either a different contentId
                    or no contentId at all.
                </TextBlock>

                <TextBlock Style="{StaticResource BasicTextStyle}" TextWrapping="Wrap" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,20,0,0" FontWeight="SemiBold">
                    In this scenario, you send four different notifications, but because the large (Square310x310) binding has the same contentId in the last three notifications, the redundant bindings are deduplicated. This results in the large tile cycling between only two notifications instead of four.
                </TextBlock>

                <TextBlock Style="{StaticResource BasicTextStyle}" TextWrapping="Wrap" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,20,0,0">
                    First, enable the notification queue. This can be done for individual tile sizes, but in this example we enable it for all sizes.
                </TextBlock>

                <StackPanel Orientation="Vertical" >
                    <Button x:Name="EnableNotificationQueue" Content="Enable notification queue" Click="EnableNotificationQueue_Click"/>
                </StackPanel>

                <TextBlock Style="{StaticResource BasicTextStyle}" TextWrapping="Wrap" VerticalAlignment="Center" HorizontalAlignment="Left" Margin="0,20,0,0" FontWeight="SemiBold">
                    Next, send all four notifications. Go to the Start screen and notice that when you choose the small or wide tile size, the tile cycles between four sets of content. Change to the large tile size and note that the tile cycles between just two sets of content.

                    In this example, we also use notification tags, which allow us to selectively replace specific notifications in the queue.
                </TextBlock>

                <Button x:Name="SendNotifications" Content="Send notifications" Click="SendNotifications_Click"/>

                <StackPanel Orientation="Horizontal" Margin="0,10,0,0">
                    <Button x:Name="ClearTile" Content="Clear tile" Click="ClearTile_Click"/>
                </StackPanel>
            </StackPanel>
        </Grid>

        <Grid x:Name="Output" HorizontalAlignment="Left" VerticalAlignment="Top" Grid.Row="1">
            <TextBlock x:Name="OutputTextBlock" Text="" TextWrapping="Wrap" Style="{StaticResource BasicTextStyle}" IsTextSelectionEnabled="True"/>
        </Grid>

        <!-- Add Storyboards to the visual states below as necessary for supporting the various layouts -->
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup>
                <VisualState x:Name="DefaultLayout"/>
                <VisualState x:Name="Below768Layout"/>
            </VisualStateGroup>
        </VisualStateManager.VisualStateGroups>
    </Grid>

</common:LayoutAwarePage>